<template>
	<view class="container">
		<image class="l_logo" src="../../static/duomijie.png" mode=""></image>
		<view class="l_page_w" v-if="isWXlogin">
			<!-- <view class="l_message">去完成微信授权以继续使用</view> -->
			<view class="l_l_w_login_wp" @click.stop="getcheckMesage">
				<image src="../../static/login_button.png" mode=""></image>
				<text>一键快捷登陆</text>
				<!-- <button class="l_w_login" v-show="ischecked" open-type="getPhoneNumber" @getphonenumber="getUserProfile">一键快捷登陆</button> -->
				<button class="l_w_login" v-show="ischecked" @click="getUserProfile">一键快捷登录</button>
			</view>
			<view class="l_mobile" @click="isWXlogin=!isWXlogin">账号密码登录</view>
		</view>

		<view class="l_page_mobile" v-if="!isWXlogin">
			<view class="l_from">
				<view class="input-item">
					<text class="l_from_title">手机号码</text>
					<input type="number" :value="mobile" placeholder="请输入手机号码" maxlength="11" data-key="mobile"
						@input="inputChange" />
				</view>
				<view class="input-item">
					<text class="l_from_title">密码</text>
					<input type="mobile" value="" placeholder="8-18位不含特殊字符的数字、字母组合" placeholder-class="input-empty"
						maxlength="20" password data-key="password" @input="inputChange" @confirm="toLogin" />
				</view>
				<!-- <view @click="navto('forget')" class="forget-password">忘记密码</view> -->
			</view>
<!-- 			<view class="register-section">
				还没有账号?
				<text @click="toRegist">马上注册</text>
			</view> -->
			<button class="confirm-btn" @tap="toLogin">登录</button>
			<view class="l_mobile" @click="isWXlogin=!isWXlogin">返回一键快捷登陆</view>
		</view>
		<view class="l_agreement">
			<radio color="f44301" @click="ischecked=!ischecked" :checked="ischecked" />
			我已阅读并同意<text @click="navto('https://bpapi.jinghushi.com/agreement.html')">《用户协议》</text>和<text
				@click="navto('https://bpapi.jinghushi.com/policy.html')">《隐私政策》</text>
		</view>
		<uni-popup ref="inputDialog" type="dialog">
			<uni-popup-dialog ref="inputClose" :value="mid" before-close="true" mode="input" title="推荐人ID" placeholder="请输入推荐人ID" @confirm="dialogInputConfirm" @close="closeDialog"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';

	export default {
		data() {
			return {
				isWXlogin: true,
				mobile: '',
				password: '',
				mid: 0,
				checkedYin: 0,
				ischecked: false,
			}
		},
		onLoad(options) {
			// const accountInfo = uni.getAccountInfoSync();
			// this.$store.commit('upversion', accountInfo.miniProgram.version);
			// uni.setStorageSync('ver', accountInfo.miniProgram.version);
			if(options.mid){
				this.mid = options.mid;
			}
			console.log(options.mid)
			if (uni.getStorageSync('token') != '') {
				uni.setStorageSync('Jh_recotabshops', 1)
				uni.switchTab({
					url: '/pages/index/index'
				});
			}
		},
		methods: {
			...mapMutations(['login']),
			getcheckMesage() {
				if (!this.ischecked) {
					this.$api.msg('请勾选协议政策！');
					return;
				}
			},
			inputChange(e) {
				const key = e.currentTarget.dataset.key;
				this[key] = e.detail.value;
			},
			downloadapp() {
				window.location.href = 'https://h5.bkyh.top/downapp/index.html';
			},
			navBack() {
				uni.setStorageSync('Jh_recotabshops', 1)
				uni.switchTab({
					url: '/pages/index/index'
				});
			},
			toRegist() {
				var url = this.mid > 0 ? 'register?id=' + this.mid : 'Recommended';
				uni.navigateTo({
					url
				})
			},
			Yinchange(e) {
				this.checkedYin = e.detail.value.length;
			},
			async toLogin() {
				if (!this.ischecked) {
					this.$api.msg('请勾选协议政策！');
					return;
				}
				var that = this;
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						uni.getUserInfo({
							provider: 'weixin',
							success: function(infoRes) {
								let obj = infoRes;
								obj.code = loginRes.code;
								obj.mid = that.mid;
								obj.mobile = that.mobile;
								obj.pwd = that.password;
								that.$axios('login/dologin', "POST", 'member', obj).then(
									res => {
										if (res.data.code == 200) {
											uni.setStorageSync('token', res.data.data.token);
											uni.setStorageSync('Jh_recotabshops', 1)
											uni.switchTab({
												url: '/pages/individualism/user'
											});
										}
									})
							}
						});
					},
					fail: function(res){
						console.log(res)
					}
				});
			},
			
			navto(url) {
				if (url != "#" && url != "") {
					if (url.indexOf('http') == -1) {
						uni.navigateTo({
							url: url
						})
					} else {
						// #ifdef APP-PLUS || MP-WEIXIN
						uni.navigateTo({
							url: "../web/web-view?url=" + url
						})
						// #endif
						// #ifdef H5
						window.location.href = url
						// #endif
					}
				}
			},
			// getUserProfile(e) {
			// 	let that = this;
			// 	uni.login({
			// 		provider: 'weixin',
			// 		success: function(loginRes) {
			// 			let obj = e.detail;
			// 			obj.code1 = loginRes.code;
			// 			obj.mid = that.mid;
			// 			that.$axios('login/xcxlogin', "POST", 'member', obj).then(
			// 				res => {
			// 					if (res.data.code == 200) {
			// 						uni.setStorageSync('token', res.data.data);
			// 						uni.setStorageSync('Jh_recotabshops', 1);
			// 						uni.switchTab({
			// 							url: '/pages/mallHome/selfMall'
			// 						});
			// 					}else if(res.data.code==40001){
			// 						that.$refs.inputDialog.open();
			// 					}
			// 				})
			// 		},
			// 		fail() {
			// 			that.$api.msg('登录失败，请重试！')
			// 		}
			// 	})
			// },
			getUserProfile(e) {
				// let that = this;
				uni.login({
					provider: 'weixin',
					success: loginRes=> {
						this.$axios('login/xcxlogin','POST','member',{
							aid: uni.getStorageSync('appid').slice(-4),
							mid: this.mid,
							code1: loginRes.code
						}).then(res=>{
							if(res.data.code == 200){
								uni.setStorageSync('token', res.data.data);
								uni.setStorageSync('Jh_recotabshops', 1);
								uni.switchTab({
									url: '/pages/index/index'
								});
							}else if(res.data.code==40001){
								this.$refs.inputDialog.open();
							}
						})
					},
					fail() {
						that.$api.msg('登录失败，请重试！')
					}
				})
			},
			dialogInputConfirm(value){
				let that = this;
				if(!value) return that.$api.msg('请输入推荐人ID');
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						// console.log(loginRes)
						// return;
						that.$axios('login/bindmid','POST','member',{
							aid: uni.getStorageSync('appid').slice(-4),
							code: loginRes.code,
							agentid: value
						}).then(res=>{
							if(res.data.code == 200){
								uni.setStorageSync('token', res.data.data);
								uni.setStorageSync('Jh_recotabshops', 1);
								that.$refs.inputDialog.close();
								uni.switchTab({
									url: '/pages/index/index'
								});
							}
						})
					},
					fail() {
						that.$api.msg('登录失败，请重试！')
					}
				})
			},
			closeDialog(){
				this.$refs.inputDialog.close();
			},
		},

	}
</script>

<style lang='scss'>
	.container {
		color: $font-color-dark;
		padding-top: 190upx;
	}

	.l_logo {
		display: block;
		height: 108upx;
		margin: 40upx auto 30upx;
		width: 248upx;
	}

	.l_page_w {
		padding: 40upx 20upx;
	}

	.l_message {
		font-weight: bold;
		line-height: 70upx;
		text-align: center;
	}

	.l_l_w_login_wp {
		color: #FFFFFF;
		position: relative;
		margin: 0 6%;
		text-align: center;
		height: 70upx;
	}

	.l_l_w_login_wp image {
		height: 100%;
		width: 544upx;
	}

	.l_l_w_login_wp text {
		font-size: 28upx;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.l_w_login {
		position: absolute;
		top: 0;
		color: #FFFFFF;
		font-size: 30upx;
		width: 100%;
		height: 70upx;
		opacity: 0;
	}

	.l_mobile {
		color: #6501ff;
		font-weight: bold;
		text-align: center;
		font-size: 28upx;
		padding: 30upx;
	}

	.l_page_mobile {
		padding: 0 20upx;
	}

	.l_from {
		padding: 0 40upx;
	}

	.input-item {
		background: $page-color-light;
		border-radius: 4px;
		padding: 20upx 30upx;
		margin-bottom: 30upx;
	}

	.l_from_title {
		color: $font-color-base;
		font-size: $font-sm+2upx;
		line-height: 56upx;
	}

	.input-item input {
		color: $font-color-dark;
		font-size: 26upx;
		height: 60upx;
		width: 100%;
	}

	.forget-password {
		color: #4399fc;
		font-size: $font-sm;
		margin-left: 10upx;
		text-decoration: underline;
	}

	.register-section {
		color: $font-color-base;
		font-size: $font-sm+2upx;
		text-align: center;
		position: relative;
		width: 100%;
	}

	.register-section text {
		color: $font-color-spec;
		margin-left: 10upx;
	}

	.confirm-btn {
		background: #13963B;
		border-radius: 50px;
		color: #fff;
		font-size: $font-lg;
		height: 76upx;
		line-height: 76upx;
		margin-top: 30upx;
		width: 92%;
	}

	.l_agreement {
		/* position: fixed; */
		top:60px;
		bottom: 90upx;
		font-weight: bold;
		text-align: center;
		width: 100%;
	}

	.l_agreement text {
		color: #13963B;
		font-size: 26rpx;
	}
</style>